Quick Index
Overview
Concept Sketches
The Model is Unlimited
Index
Overview
Concept Sketches
Three components
Two Major Areas
General Example
Specific Example (before)
Specific Example (click)
Specific Example (after)
The Model is Unlimited
Overview
A video that accompanies the chapter
is here...
.
The
Model-View-Controller (MVC)
design pattern was introduced into the Smalltalk language way (way) back in the 70's.
It is a pattern to organize code into three groups:
Model
View
Controller
It is a nice simple pattern as is shown in the following concept sketches.
Concept Sketches
Three components
You'll see in the next sketches that the mechanism works by components sending messages to one another.
In MVC, you'll see the message flow is actually relatively simple.
Two Major Areas
We can even simplify it further into:
Model
User Interface (UI)
General Example
An event fires in the view
The view sends an "event handler" message to the controller (the handler is associated with the event).
The controller sends an "action" message to the model.
Specific Example (before)
We have a tripler model (object). It has a value and can triple the value.
The purpose of the UI is to display the model, and to offer actions like button clicks to manipulate the model.
All is quiet at the moment.
Specific Example (click)
Button is pressed which fires click event
View sends message that is associated with event to controller.
Controller recieves message and relays message "triple" to model.
The model would then triple its value (shown on next step).
Specific Example (after)
The model received the triple message so has tripled its value from 5 to 15.
And the view has simply refreshed to display the updated value.
The Model is Unlimited
All three of these mvc players are essential.
Because we can generalize the view and controller, most of our specific work in this course will be in the
model.
Think about the breadth of the model layer. We could code a model of anything we can think of:
Circle
Employee
SolarSystem
Planet
Car
Park
Train
Road
Stock
... towards infinity
JavaScript Guide (Chapter 304 - MVC)
<
MVC
>
Search Site
Home
Back To Top